
<template>
    <div>
        <Table border ref="table" :columns="columns" :data="tableData" :max-height="tableHeight"
            @on-select="handleSelect"
            @on-select-cancel="handleCancel"
            @on-select-all="handleSelectAll"
            @on-select-all-cancel="handleSelectCancel">
        </Table>
    </div>
</template>
/*
 * @Author: hananmin 
 * @Date: 2021-03-30 18:11:28 
 * @Last Modified by: hananmin
 * @Last Modified time: 2021-03-30 21:11:48
 * 分页的组件
 */
<script>
export default {
    props:{
        columns:{
            type: Array
        },
        tableData:{
            type: Array
        },
        extraData:{
            type: Object
        }
    },
    data (){
        return {
            // 表的高度, 在挂载的时候会调整高度
            tableHeight : 400,
            // 存储被选中的数据
            selectData: {}
        }
    },
    methods:{
        // 选中的数目
        getSelectNum(){
            let selectMember = []
            for(let key in this.selectData){
                this.selectData[key].forEach(
                    (item) => {
                        selectMember.push(item)
                    }
                )
            }
            this.$emit("getSelectSum", selectMember.length, selectMember)
        },
        // 单选的时候
        handleSelect(selection, row){
            let rowId = ""
            if(row.fileId){
                if(typeof row.fileId === 'number'){
                    rowId = (row.fileId).toString()
                } else {
                    rowId = row.fileId
                }
                let pageNum = this.extraData.pageNo
                if(this.selectData.hasOwnProperty(pageNum)){
                    !this.selectData[pageNum].includes(rowId) ? this.selectData[pageNum].push(rowId) : null
                } else {
                    this.selectData[pageNum] = [rowId]
                }
            }
            this.getSelectNum()
        },
        // 单选取消
        handleCancel(selection, row){
            let rowId = ""
            if(row.fileId){
                if(typeof row.fileId === 'number'){
                    rowId = (row.fileId).toString()
                } else {
                    rowId = row.fileId
                }
            }
            let pageNum = this.extraData.pageNo
            this.selectData[pageNum].splice(this.selectData[pageNum].indexOf(rowId), 1)
            this.getSelectNum()
        },
        // // // 全选
        handleSelectAll(selection){
            let pageNum = this.extraData.pageNo
            selection.forEach((item) => {
                let rowid = typeof item.fileId === 'number' ? (item.fileId).toString() : item.fileId;
                if(this.selectData[pageNum]){
                    if(!this.selectData[pageNum].includes(rowid)){
                        this.selectData[pageNum].push(rowid)
                    }
                } else{
                    this.selectData[pageNum] = [rowid]
                }
            });
            this.getSelectNum()
        },
        // // // 全选取消
        handleSelectCancel(Selection){
            let pageNum = this.extraData.pageNo
            delete this.selectData[pageNum]
            this.getSelectNum()
        },
        getTableHeight(){
            // 动态设置表格高度 
            this.tableHeight = window.innerHeight  * 0.7
        }
    },
    mounted() {
        this.getTableHeight()
        window.onresize = () => {
            this.getTableHeight()          
        }
    }
}
</script>